<!--
  功能说明：文件上传组件，演示通过 Axios 提交 FormData。
-->
<template>
  <div>
    <input type="file" @change="onPick" />
    <button :disabled="!file" @click="onUpload">上传</button>
    <div v-if="message" class="msg">{{ message }}</div>
  </div>
  
</template>

<script>
import { uploadFile } from '../api/files'

export default {
  name: 'FileUploader',
  data() {
    return {
      file: null,
      message: ''
    }
  },
  methods: {
    onPick(e) {
      this.file = e.target.files[0]
    },
    async onUpload() {
      try {
        const res = await uploadFile(this.file)
        this.message = `上传成功：${res.fileName}`
      } catch (e) {
        this.message = '上传失败：' + e.message
      }
    }
  }
}
</script>

<style>
.msg { margin-top: 8px; color: #666; }
</style>